<template>
    <div class="app-container">
        <el-row>
            <el-col :span="11">
                <div>
                    <el-form :model="orderInfo" label-width="98px">
                        <el-form-item label="会诊医院">
                            <el-input disabled v-model="orderInfo.serviceCenterName"></el-input>
                        </el-form-item>
                        <el-form-item label="送检医院" v-if="orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.sendingHospitalName"></el-input>
                        </el-form-item>
                        <el-form-item label="会诊类型" v-if="orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.typeOfConsultationName"></el-input>
                        </el-form-item>
                        <el-form-item label="送检医生" v-if="orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.sendingDoctor"></el-input>
                        </el-form-item>
                        <el-form-item label="送检医生手机" v-if="orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.sendingDoctorPhone"></el-input>
                        </el-form-item>
                        <el-form-item label="送检时间">
                            <el-input disabled v-model="orderInfo.createTime"></el-input>
                        </el-form-item>
                        <el-form-item label="订单号" v-if="!orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.serialNumber"></el-input>
                        </el-form-item>
                        <el-form-item label="患者姓名" v-if="!orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.patients[0].name"></el-input>
                        </el-form-item>
                        <el-form-item label="性别" v-if="!orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.patients[0].sexName"></el-input>
                        </el-form-item>
                        <el-form-item label="年龄" v-if="!orderInfo.sendingHospitalName">
                            <el-input disabled v-model="orderInfo.patients[0].age"></el-input>
                        </el-form-item>
                    </el-form>
                </div>

            </el-col>
            <el-col :span="2">
                <div>
                    <div class="line"></div>
                </div>
            </el-col>
            <el-col :span="11">
                <el-button @click="chooseFileHandle" type="primary" style="width: 100%;height: 80px;margin-bottom: 8px"
                           :loading="uploading">
                    上传<i class="el-icon-upload el-icon--right"></i></el-button>
                <div style="overflow:auto; height: 600px">
                    <div v-for="item in uploadFileListsCopy" style="margin-top: 16px">
                        <div style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: inline-block;">{{ item.filename }}</div>
                        <div style="color:#419FFFFF ">{{ item | scale}}</div>
                        <el-progress :text-inside="true" :stroke-width="16" :percentage="item.progress"
                                     status="success"></el-progress>
                    </div>
                </div>
            </el-col>
        </el-row>
    </div>
</template>

<script>
import {ipcRenderer} from "electron";
import {getOrder, uploadPhoto, wAnDaAi} from "@/api/upload";

import morePics from "@/components/LandingPage/morePics";
import {v4 as nanoid} from 'uuid';
import {useAppStore} from "@/store/app"

const {uploadFileLists, INIT_UPLOAD} = useAppStore()

import {
    fileListHandle,
    getParamsHandle,
    moveFileHandle, readFileHandle,
    removeFileHandle
} from "@/utils/tools";

const {dialog} = require('electron')
const fse = require('fs-extra')
const fs = require('fs');
const path = require('path')

export default {
    name: "SystemInformation",
    components: {morePics},
    data() {
        return {
            orderInfo: {},
            uploading: false,
            diagnosisHistoryId: null,
            specimenCategory: null
        }
    },
    computed: {
        uploadFileListsCopy() {
            return uploadFileLists
        },
    },
    methods: {
        // 删除某张文件夹图片
        async removeHandle(prePath) {
            await removeFileHandle(prePath)
        },
        //选择备份文件夹  type: 0获取原文件夹  1获取备份文件夹
        async chooseFileHandle(type) {
            ipcRenderer.invoke("open-dialog", ['openFile', 'multiSelections']).then(async res => {
                if (res.length === 0) return
                let filesObj = []
                res.forEach(item => {
                    const filename = path.basename(item)
                    let fileId = nanoid()
                    const obj = {fullName: item, filename, fileId, progress: 0, isUploaded: false, total:0, loaded:0}
                    INIT_UPLOAD(obj)
                    filesObj.push(obj)
                })
                await this.uploadFiles(filesObj)
            }).catch(err => {
                console.log(err)
            })
        },
        async uploadFiles(files) {
            console.log('debugger----前')
            debugger
            console.log('debugger----后')
            this.uploading = true
            for (const fdKey in files) {
                let fd = new FormData()
                const fileObj = files[fdKey]
                const aFile = await readFileHandle(fileObj.fullName)
                fd.append('file', aFile.blob, aFile.name)

                const ext = path.extname(fileObj.filename)
                const fullPath = path.dirname(fileObj.fullName); // 文件夹路径
                const aFilePart = fileObj.filename.split(ext)
                const dirName = aFilePart[0] // 同路径下同名文件夹

                const fullDirPath = path.join(fullPath, dirName); // 同路径下同名文件夹完整路径
                const d3files = await fileListHandle(fullDirPath);
                for (const d3filesKey in d3files) {
                    const ad3File = await readFileHandle(d3files[d3filesKey]);
                    fd.append('file', ad3File.blob, ad3File.name)
                }
                const data = await uploadPhoto(fd, fileObj);
                console.log('data---',data);
                if (data.code === 0 && this.diagnosisHistoryId != null && this.specimenCategory != null) {
                    let fileData = {
                        "descriotion": "",
                        "diagnosisHistoryId": this.diagnosisHistoryId,
                        "dziAddress": `/images/${data.file}.dzi`,
                        "fileAddress": data.file,
                        "fileType": 3,
                        "labelAddress":  `/images/${data.file}_labelinfo.jpg`,
                        "preFileAddress": `/images/${data.file}_priview.jpg`,
                        "name":data.oldFilename,
                    }
                    const wAnData = await wAnDaAi({
                        "createDiagnosisDataParameters": fileData,
                        "filepath": data.file,
                        "specimenCategory": this.specimenCategory
                    })
                    console.log(wAnData)
                }
            }
            this.uploading = false
            this.uploadNotice()
        },

        uploadNotice() {
            this.$confirm('切片上传完成, 是否继续?点击<<上传完成>>进行返回,在界面中点击<<刷新显示3D切片>>刷新查看3D切片', '提示', {
                confirmButtonText: '上传完成',
                cancelButtonText: '继续上传',
                type: 'warning'
            }).then(() => {
                ipcRenderer.invoke("window-close");
            }).catch(() => {
                // this.$message({
                //     type: 'warning',
                //     message: '此核对上传切片是否和会诊信息匹配'
                // });
                this.chooseFileHandle()
            });
        },

        async init() {
            await this.getOrder()
            this.diagnosisHistoryId = await getParamsHandle('diagnosisHistoryId')
            this.specimenCategory = await getParamsHandle('specimenCategory')
        },

        async getOrder() {
            const orderId = await getParamsHandle('order')
            const {code, data} = await getOrder(orderId);
            if (code === 200) {
                this.orderInfo = data
                console.log('getOrder-this.orderInfo',this.orderInfo)
            }
        },

    },
    beforeDestroy() {

    },
    mounted() {
        console.log('this.$route', this.$route);

    },
    async created() {
        await this.init()
    },
    filters: {
        scale: function (item) {
            const total = (item.total/(1024*1024)).toFixed(2)
            const loaded = (item.loaded/(1024*1024)).toFixed(2)
            console.log(total)
            return `${loaded} M/ ${total} M`
        }
    }
};
</script>

<style scoped rel="stylesheet/scss" lang="scss">
.app-container {
    padding: 20px;
}

.grid-content {
    border-radius: 4px;
    min-height: 36px;
}

.bg-purple-dark {
    background: #99a9bf;
}

.line {
    &:after {
        content: "";
        margin-left: 15px;
        padding-left: 15px;
        border-left: 1px solid #c0c4cc;
        height: 700PX;
        display: inline-block;
        vertical-align: middle;
    }
}

</style>
